<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>物料管理管理</title>
	<meta name="decorator" content="default"/>
	<script type="text/javascript">
	var subFlag = true;
		$(document).ready(function() {
			//$("#name").focus();
			$("#inputForm").validate({
				onfocusout: function(element) { $(element).valid(); },  
				submitHandler: function(form){
					loading('正在提交，请稍等...');
					form.submit();
				},
				rules:{          
					type:{required:true},
					cnName:{required:true,string:true}, 
					remark:{remarkCheck:true} ,
					venderCode:{required:true,venderCode:true},
					erp:{required:true,venderCode:true}
					
	            },
	            
				errorContainer: "#messageBox",
				errorPlacement: function(error, element) {
					$("#messageBox").text("输入有误，请先更正。");
					if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
						error.appendTo(element.parent().parent());
					} else {
						error.insertAfter(element);
					}
				}
	             
			});
			jQuery.validator.addMethod("remarkCheck", function(value,  
	                element, param) { 
				if(value.length>100){
					return false;
				} else{
					return true;
	            }
	        }, $.validator.format("字数超限"));
			// 字符验证
			
			jQuery.validator.addMethod("string", function(value, element) {
				return this.optional(element) ||  /^(?=.*[\u4e00-\u9fa5]).{4,100}$/.test(value);
			}, "请输入4-100个字符，须含汉字，可带数字、字母、标点符号");
			jQuery.validator.addMethod("venderCode", function(value, element) {
				return this.optional(element) || /^[a-zA-Z0-9]{4,20}$/.test(value);
			}, "4-20个数字或字母");
			$("#remark").keyup(function(){
				var curLength=$("#remark").val().length;
				if(curLength>100){
					$("#textLength").css("color","red");
					$("#textLength").text(curLength+"/100   字数超限");
				}else{
					$("#textLength").text(curLength+"/100");
				}
			});
		});
		function findtemplate(v) {
		
		    $.ajax({
		        type : "post",
		        async : false,
		        url : "${ctx}/sys/materiel/twiceClassData",
		        data : {
		            'useId' : v
		        },
		        dataType : "json",
		        success : function(msg) {
		            $("#classessTwiceId").empty();
		            $('#s2id_classessTwiceId').find('.select2-chosen').text('二级类目');
		            //$("#template").select2();
		            if (msg.length > 0) {
		                for (var i = 0; i < msg.length; i++) {
		                        var partId = msg[i].id;
		                        var partName = msg[i].name;
		                        var $option = $("<option>").attr({
		                            "value" : partId
		                        }).text(partName);
		                        $("#classessTwiceId").append($option);
		                }
		                //$("#template option:first").prop("selected", 'selected');
		                $("#classessTwiceId").change();
		               
		            }
		        },
		        error : function(json) {
		            $.jBox.alert("网络异常！");
		        }
		    });
		}
		
	   
		function findtemplate2() {
		var st=$("#classessTwiceId").val();
		
		    $.ajax({
		        type : "post",
		        async : false,
		        url : "${ctx}/sys/materiel/thirdClassData",
		        data : {
		            'useId' : st
		        },
		        dataType : "json",
		        success : function(msg) {
		            $("#classessThirdId").empty();
		            //$('#s2id_city').find('.select2-chosen').text('三级类目');
		            //$("#template").select2();
		            if (msg.length > 0) {
		                for (var i = 0; i < msg.length; i++) {
		                        var partId = msg[i].id;
		                        var partName = msg[i].name;
		                        var $option = $("<option>").attr({
		                            "value" : partId
		                        }).text(partName);
		                        $("#classessThirdId").append($option);
		                }
		                //$("#template option:first").prop("selected", 'selected');
		                $("#classessThirdId").change();

		            }
		        },
		        error : function(json) {
		            $.jBox.alert("网络异常！");
		        }
		    });
		}
		function partsCodeChange(){
			var partsCode = $('#partsCode').val();
			$.ajax({
		        type : "post",
		        async : false,
		        url : "${ctx}/sys/parts/getNameByCode",
		        data : {'code' : partsCode},
		        dataType : "json",
		        success : function(result) {
		        	if(result!=null){
		        		$('#partsCnName').val(result.cnName);
		        	}
		        }
			})
		}
		function searchParts() {//点击“搜”执行的内容
			if(subFlag){
				var searchVal = $("#partsCodeInput").val();
				if(searchVal==""){
					$("#partsCode").empty();
					$("#partsCode").append("<option value=''>请输入配件号</option>");
					$("#partsCode").select2().val("").trigger("change");
					return;
				}
				$("#partsCode").empty();
				$("#partsCode").append("<option value=''>正在读取中...</option>");
				$("#partsCode").select2().val("").trigger("change");
				subFlag = false;
				$.ajax({
					url : "${ctx}/sys/materiel/searchParts",
					data : {"code" : searchVal},
					dataType : "json",
					type : "post",
					success : function(data) {
						if (data.resultCode == "1") {
							$("#partsCode").empty();
							for(var i=0;i<data.list.length;i++){
								$("#partsCode").append("<option value='"+data.list[i].code+"'>"+data.list[i].code+"</option>");
							}
							if(data.list.length>0){
								$('#partsCode').bind('change', partsCodeChange);//为div绑定RecommandProduct 函数
								$("#partsCode").select2("open");
								$("#partsCode").select2().val(data.list[0].code).trigger("change");
							}else{
								$("#partsCode").append("<option value=''>没有搜索到匹配项</option>");
								$("#partsCode").select2().val("").trigger("change");
							}
						}
						subFlag = true; 
				},
					error : function() {
						subFlag = true;
						alert("网络异常");
					}
				});
			}
		}
		
		/* function pat(){
		     var partsCode=$("#partsCode").val();
		     $.ajax({
		    	 url:"${ctx}/sys/materiel/partsData",
		    	 type:"post",
		    	 dataType : "json",
		    	 data:{"code":partsCode},
		    	 success:function(data){
		    		if(data!=null) {
		    			$("#partsCnName").val(data.cnName);
		    		}
		    		 
		    	 }
		     })
		} */
		
		
		 $(function(){
			var ps=$("#ps").val();
			if(ps==2){
			var v=$("#classessOnceId").val();
			var vg=$("#classTwice").val();
			var vgs=$("#classThird").val()
			$.ajax({
		        type : "post",
		        async : false,
		        url : "${ctx}/sys/materiel/twiceClassData",
		        data : {
		            'useId' : v
		        },
		        dataType : "json",
		        success : function(msg) {
		            $("#classessTwiceId").empty();
		            $('#s2id_classessTwiceId').find('.select2-chosen').text('二级类目');
		            //$("#template").select2();
		            if (msg.length > 0) {
		                for (var i = 0; i < msg.length; i++) {
		                        var partId = msg[i].id;
		                        var partName = msg[i].name;
		                  
		                       if(vg==partId){
		       
		                    	   var $option = $("<option selected='selected'>").attr({
			                            "value" : partId
			                        }).text(partName);
		                       }else{
		                    	   var $option = $("<option >").attr({
			                            "value" : partId
			                        }).text(partName);
		                       }
		                        $("#classessTwiceId").append($option);
		                        
		                }
		            
		                $("#classessTwiceId").change();
		               
		            }
		        },
		        error : function(json) {
		            $.jBox.alert("网络异常！");
		        }
		    });
			
			var st=$("#classessTwiceId").val();
			    $.ajax({
			        type : "post",
			        async : false,
			        url : "${ctx}/sys/materiel/thirdClassData",
			        data : {
			            'useId' : st
			        },
			        dataType : "json",
			        success : function(msg) {
			            $("#classessThirdId").empty();
			            //$('#s2id_city').find('.select2-chosen').text('三级类目');
			            //$("#template").select2();
			            if (msg.length > 0) {
			                for (var i = 0; i < msg.length; i++) {
			                        var partId = msg[i].id;
			                        var partName = msg[i].name;
			                        if(vgs==partId){
			                        	
				                    	   var $option = $("<option selected='selected'>").attr({
					                            "value" : partId
					                        }).text(partName);
				                       }else{
				                    	   var $option = $("<option >").attr({
					                            "value" : partId
					                        }).text(partName);
				                       }
			                        $("#classessThirdId").append($option);
			                }
			                
			                $("#classessThirdId").change();

			            }
			        },
			        error : function(json) {
			            $.jBox.alert("网络异常！");
			        }
			    });
			}
		}) 
		
	</script>
</head>
<body>
   <input name="classTwice" id="classTwice" value="${twices }" type="hidden"/>
   <input name="classThird" id="classThird" value="${thirds }" type="hidden"/>
	<ul class="nav nav-tabs">
		<li><a href="${ctx}/sys/materiel/materList">物料管理列表</a></li>
		<li class="active"><a href="${ctx}/sys/materiel/form?id=${materiel.id}">物料管理<shiro:hasPermission name="sys:materiel:edit">${not empty materiel.id?'修改':'添加'}</shiro:hasPermission><shiro:lacksPermission name="sys:materiel:edit">查看</shiro:lacksPermission></a></li>
	</ul><br/>
	<form:form id="inputForm" modelAttribute="materiel" action="${ctx}/sys/materiel/save" method="post" class="form-horizontal">
		<form:hidden path="id"/>
		<input name="ps" value="${ps }" type="hidden" id="ps" />
		<sys:message content="${message}"/>		
		<div class="control-group">
			<label class="control-label">配件编号：</label>
			<div class="controls">
				<select id="partsCode" name="partsCode" class="partsSelect input-small">
					<option value="">请选择配件编号</option>
					<c:if test="${not empty materiel.partsCode}">
						<option value="${materiel.partsCode }" selected="selected">${materiel.partsCode }</option>
					</c:if>
			    </select>
				<span class="help-inline"><font color="red">*</font></span>
				<input name="partsCodeInput" id="partsCodeInput" type="text" placeholder="请输入筛选条件" class="input-small "/>
				<input type="button" onclick="searchParts()" class="btn btn-primary" value="搜索"/>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">配件名称：</label>
			<div class="controls">
				<form:input path="partsCnName" htmlEscape="false" maxlength="100" readonly="true" class="input-xlarge "/>
			</div>
		</div>
		
		<div class="control-group" >
			<label class="control-label">所属类目:</label>
			<div class="controls">
                 <form:select id="classessOnceId" path="classessOnceId" class="input-medium" onchange="findtemplate(this.options[this.options.selectedIndex].value);">
			     <form:option value="" label="一级类目"/>
			     <form:options items="${classes}" htmlEscape="false" itemValue="id" itemLabel="name"/>
			     </form:select>
			     
			     <form:select id="classessTwiceId" path="classessTwiceId" class="input-medium" onchange="findtemplate2();" >
			     <form:option value="" label="二级级类目"/>
			     </form:select>
			     
			     <form:select id="classessThirdId" path="classessThirdId" class="input-medium required" >
			     <form:option value="" label="三级级类目"/>
			     </form:select>
			     <span class="help-inline"><font color="red">*</font></span>
			</div>
		</div>
		
		<div class="control-group">
			<label class="control-label">ERP码：</label>
			<div class="controls">
				<form:input path="erp" htmlEscape="false" maxlength="20" class="input-xlarge required"/>
				<span class="help-inline"><font color="red">*</font> </span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">物料名称：</label>
			<div class="controls">
				<form:input path="cnName" htmlEscape="false" maxlength="50" class="input-xlarge required"/>
				<span class="help-inline"><font color="red">*</font> </span>
			</div>
		</div>
		
		<div class="control-group">
			<label class="control-label">制造商品牌：</label>
			<div class="controls">
				<form:select id="venderId" path="venderId" class="input-medium required">
				<form:option value="" label="请选择制造商品牌"/>
			    <form:options items="${vender}" htmlEscape="false" itemValue="id" itemLabel="name"/></form:select>
				<span class="help-inline"><font color="red">*</font> </span>
			</div>
		</div>
		
		<div class="control-group">
			<label class="control-label">厂家编号：</label>
			<div class="controls">
				<form:input path="venderCode" htmlEscape="false" maxlength="50" class="input-xlarge required"/>
				<span class="help-inline"><font color="red">*</font> </span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">物料描述：</label>
			<div class="controls">
			    <span id="textLength" style="margin-top: 74px;position: absolute;line-height: 1; margin-left: 475px;color: red;">0/100</span>
				<form:textarea path="remark" htmlEscape="false" rows="4" maxlength="255" class="input-xxlarge "/>
			</div>
		</div>
		<div class="form-actions">
			<shiro:hasPermission name="sys:materiel:edit"><input id="btnSubmit" class="btn btn-primary" type="submit" value="保 存"/>&nbsp;</shiro:hasPermission>
			<input id="btnCancel" class="btn" type="button" value="返 回" onclick="history.go(-1)"/>
		</div>
	</form:form>
</body>
</html>